<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta content="" name="description"/>
    <meta content="webthemez" name="author"/>
    <title>修改密码</title>

    <!-- jQuery Js -->
    <script src="assets/js/jquery-1.10.2.js"></script>
    <!-- layer Js -->
    <script src="assets/js/layer.js"></script>
    <!-- base Js -->
    <script src="assets/js/base.js"></script>
    <style>
        body, html, head {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            background-color: #4D4D4D;
        }

        .title_div {
            position: fixed;
            top: 20%;
            left: 35%;
            width: 30%;
            font-size: 24px;
            color: white;
            padding: 10px;
            text-align: center;
        }

        .login_div {
            position: fixed;
            top: 45%;
            left: 35%;
            width: 30%;
            border: 1px solid white;
            padding: 10px;
            color: white;
        }

        .login_div span {
            font-size: 20px;
            position: absolute;
            margin: 20px 10px;
        }

        .login_group {
            margin-top: 5%;
            text-align: center;
        }

        .login_group label {
            font-size: 18px;
            width: 150px;
            display: block;
            text-align: right;
        }

        .login_group input {
            width: 50%;
            position: absolute;
            margin-top: -18px;
            margin-left: -60px;
        }

        .login_group button {
            width: 85%;
            height: 30px;
            font-size: 18px;
            border-radius: 10px;
            background-color: #337AEB;
            border: none;
            color: white;
        }
    </style>
</head>

<body>
<div class="title_div">
    <img src="assets/img/logo.png" style="width: 100%;">
    <p>后台管理系统</p>
</div>
<div class="login_div">
    <img src="assets/img/none.png" style="width: 60px">
    <span>修改密码</span>
    <div class="login_group">
        <label for="login_old_pwd">旧密码:</label>
        <input type="password" id="login_old_pwd">
    </div>
    <div class="login_group">
        <label for="login_new_pwd">新密码:</label>
        <input type="password" id="login_new_pwd">
    </div>
    <div class="login_group">
        <label for="login_new_pwd_again">请再次确认新密码:</label>
        <input type="password" id="login_new_pwd_again">
    </div>
    <div class="login_group">
        <button id="submit">提交</button>
    </div>

</div>


</body>
<script>
    window.onload = function () {
        $('#submit').click(function () {
            var _old_pwd = $('#login_old_pwd').val();
            var _new_pwd = $('#login_new_pwd').val();
            var _new_pwd_again = $('#login_new_pwd_again').val();
            if (!_old_pwd) {
                layer.msg("请输入您的旧密码!", {time: 3000})
            } else if (!_new_pwd) {
                layer.msg("请输入您的新密码!", {time: 3000})
            } else if (!_new_pwd_again) {
                layer.msg("请再次输入您的新密码!", {time: 3000})
            } else if (_new_pwd != _new_pwd_again) {
                layer.msg("您两次输入的密码不同!", {time: 3000})
            } else {
                $.ajax({
                    type: "PUT",
                    url: "http://118.178.59.93:8080/Motocycle/api/v1/admins",
                    data: {
                        admin_id: storage_admin_id,
                        oldPassword: _old_pwd,
                        newPassword: _new_pwd
                    },
                    success: function (data) {
                        try {
                            var obj = JSON.parse(data);
                            if (obj.code == 0) {
                                layer.msg("密码修改成功,正在为您跳转,请稍后...");
                                setTimeout(function () {
                                    window.location.href = "user.html"
                                }, 3000)
                            }
                        } catch (e) {
                            layer.msg(data.msg, {time: 3000})
                        }
                    }
                })
            }
        });
    };

</script>
</html>